<template>
  <view class="content">
    <view class="myrow">
      <view class="icon">
        <button type="warn" size="mini">我是新人</button>
        <uni-icons class="pulldownIcon" type="pulldown" size="60" color="blue"></uni-icons>
        <button @click="goto('/pages/dog/myl/index')" class="greenBtn" size="mini">领取新人赠送</button>
      </view>
      <view class="text"> 去查看沐浴露赠送 </view>
    </view>
    <view class="myrow">
      <view class="icon">
        <button type="warn" size="mini">我有沐浴露</button>
        <uni-icons class="pulldownIcon" type="pulldown" size="60" color="blue"></uni-icons>
        <button @click="goto('/pages/dog/myl/index')" class="greenBtn" size="mini">点击去领养</button>
      </view>
      <view class="text"> 去领养狗狗 </view>
    </view>
    <view class="myrow">
      <view class="icon">
        <button type="warn" size="mini">我无沐浴露</button>
        <uni-icons class="pulldownIcon" type="pulldown" size="60" color="blue"></uni-icons>
        <button @click="goto_no" class="greenBtn" size="mini">点击去消费</button>
      </view>
      <view class="text"> 去商城消费获赠沐浴露 </view>
    </view>
  </view>
</template>

<script setup lang="ts">
const goto = (path: any) => {
  uni.navigateTo({
    url: path,
  });
};
const goto_no = () => {
  uni.showToast({
    title: '开发中,尽请期待。。。',
    icon: 'none',
  });
};
</script>

<style lang="scss" scoped>
.content {
  width: 100%;
  height: calc(100vh - 44px);
  padding: 6px;

  .myrow {
    border: green 1px solid;
    border-radius: 4px;
    padding: 10px;
    margin-bottom: 5px;

    .icon {
      display: flex;
      align-items: center;
      justify-content: space-between; //居中

      button {
        margin-left: 0px;
        margin-right: 0px;
        height: 40px;
        line-height: 40px;
        padding-left: 30px;
        padding-right: 30px;
      }

      .greenBtn {
        background-color: green;
        color: white;
      }

      .pulldownIcon {
        transform: rotate(270deg);
      }
    }
  }
}
</style>
